<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的简历</title>
    <link rel="stylesheet" href="/index.css"/>
    <script src="/js/vue.js"></script>
    <script src="/index.js"></script>
    <script src="/js/axios.min.js"></script>
</head>
<body>
<div id="app">
    <h2>我的简历</h2>
    <div class="contentArea">
        <a class="left">
            <el-form  label-width="100px" >
                <el-form-item label="姓名" >
                    <el-input v-model="resume.resume_name"></el-input>
                </el-form-item>
                <el-form-item label="性别">
                    <el-input v-model="resume.resume_sex"></el-input>
                </el-form-item>
                <el-form-item label="籍贯">
                    <el-input v-model="resume.resume_place"></el-input>
                </el-form-item>
                <el-form-item label="毕业院校">
                    <el-input v-model="resume.resume_university"></el-input>
                </el-form-item>
                <el-form-item label="学历">
                    <el-input v-model="resume.resume_degree"></el-input>
                </el-form-item>
                <el-form-item label="电话">
                    <el-input v-model="resume.resume_tel"></el-input>
                </el-form-item>
            </el-form>
        </a>
    </div>
    </el-container>
    <el-container>
        <el-header>教育背景</el-header>
        <el-container>
            <el-main>
                <div style="margin: 20px;"></div>
                <el-input
                        type="textarea"
                        :rows="7"
                        placeholder="请输入内容"
                        v-model="resume.resume_bg">
                </el-input>
            </el-main>
        </el-container>
    </el-container>
    <el-container>
        <el-header>个人经历</el-header>
        <el-container>
            <el-main>
                <div style="margin: 20px;"></div>
                <el-input
                        type="textarea"
                        :rows="7"
                        placeholder="请输入内容"
                        v-model="resume.resume_experience">
                </el-input>
            </el-main>
        </el-container>
    </el-container>
    <el-container>
        <el-header>专业技能</el-header>
        <el-container>
            <el-main>
                <div style="margin: 20px;"></div>
                <el-input
                        type="textarea"
                        :rows="7"
                        placeholder="请输入内容"
                        v-model="resume.resume_skill">
                </el-input>
            </el-main>
        </el-container>
    </el-container>
    <el-container>
        <el-header>自我评价</el-header>
        <el-container>
            <el-main>
                <el-input
                        type="textarea"
                        :rows="7"
                        placeholder="请输入内容"
                        v-model="resume.resume_evalution">
                </el-input>
            </el-main>
        </el-container>
    </el-container>
    <el-form >
        <el-form-item>
            <el-button type="button" @click="saveResume">保存</el-button>
        </el-form-item>
    </el-form>
</div>
</body>
</html>
<script>
    var vm=new Vue({
        el: "#app",
        data: {
            imageUrl: '',
            textarea: '',
            resume:{
                applicant_id:window.localStorage.getItem("applicant_id"),
            },

        },
        methods: {
            saveResume:function(){
                var applicant_id = window.localStorage.getItem("applicant_id")
                console.log(this.resume)
                axios.post('/resume/add',this.resume)
                    .then(function (response) {
                        console.log(response.data);
                        if(response.data==1){
                            //alert(applicant_id)
                            alert("新增简历成功！")
                            location.href="7.html"
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            //updateResume:function(){
           //     var applicant_id = window.localStorage.getItem("applicant_id")
            //    console.log(this.resume)
            //    axios.post('/resume/update', this.resume)
            //        .then(function (response) {
            //            console.log(response.data);
             //           if(response.data==1){
            //                alert("修改简历成功！")
            //                location.href="7.html"
            //            }
            //        })
           //         .catch(function (error) {
            //            console.log(error);
            //        });
          //  },
            handleAvatarSuccess(res, file) {
                this.imageUrl = URL.createObjectURL(file.raw);
            },
            beforeAvatarUpload(file) {
                const isJPG = file.type === 'image/jpeg';
                const isLt2M = file.size / 1024 / 1024 < 2;

                if (!isJPG) {
                    this.$message.error('上传头像图片只能是 JPG 格式!');
                }
                if (!isLt2M) {
                    this.$message.error('上传头像图片大小不能超过 2MB!');
                }
                return isJPG && isLt2M;
            },
        },
        mounted() {
           // var _this = this
           // var applicant_id = window.localStorage.getItem("applicant_id")
            //console.log("主键为："+ applicant_id)
           // axios.get('/resume/update',{
           //     params:{
           //         applicant_id: applicant_id
           //     }
          //  })
           //     .then(function (response){
           //         _this.resume = response.data
           //         console.log(response.data);
          //      })
          //      .catch(function (error){
           //         console.log(error);
           //     });
            //this.$forceUpdate()
        },
    })

</script>

<style>
    h2{
        background-color: #cfdbec
    }
    .el-header, .el-footer {
        background-color: #cfdbec;
        color: #333;
        text-align: center;
        line-height: 60px;
    }


    .el-main {
        background-color: #E9EEF3;
        color: #333;
        text-align: center;
        line-height: 160px;
    }

    body > .el-container {
        margin-bottom: 40px;
    }

    .el-container:nth-child(5) .el-aside,
    .el-container:nth-child(6) .el-aside {
        line-height: 260px;
    }

    .el-container:nth-child(7) .el-aside {
        line-height: 320px;
    }

    .contentArea{
        -webkit-text-size-adjust: 100%;
        font-size: 14px;
        line-height: 1.33;
        color: rgba(0, 0, 0, .8);
        font-family: tahoma, Helvetica, Arial, 'Hiragino Sans GB', "Microsoft Yahei", "\5FAE\8F6F\96C5\9ED1", "\5b8b\4f53", sans-serif;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 500px;
        width: 100%;
    }
    .left{
        -webkit-text-size-adjust: 100%;
        line-height: 1.33;
        font-family: tahoma, Helvetica, Arial, 'Hiragino Sans GB', "Microsoft Yahei", "\5FAE\8F6F\96C5\9ED1", "\5b8b\4f53", sans-serif;
        box-sizing: border-box;
        text-decoration: none;
        background: 0;
        color: #258fe6;
        width: 800px;
        font-size: 0;
        cursor: pointer;
        display: block;
    }
    .right{
        -webkit-text-size-adjust: 100%;
        line-height: 1.33;
        font-family: tahoma, Helvetica, Arial, 'Hiragino Sans GB', "Microsoft Yahei", "\5FAE\8F6F\96C5\9ED1", "\5b8b\4f53", sans-serif;
        box-sizing: border-box;
        text-decoration: none;
        background: 0;
        color: #258fe6;
        margin-left: 23px;
        width: 255px;
        font-size: 0;
        cursor: pointer;
        display: block;
    }

    .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }
    .avatar-uploader .el-upload:hover {
        border-color: #409EFF;
    }
    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 178px;
        height: 178px;
        line-height: 178px;
        text-align: center;
    }
    .avatar {
        width: 178px;
        height: 178px;
        display: block;
    }
</style>